const { defineConfig } = require("@vue/cli-service");
const path = require("path");

function resolve(dir) {
  return path.join(__dirname, dir);
}
const name = process.env.VUE_APP_PREFIXCLS;
const port = process.env.VUE_APP_DEV_PORT;

// 根据环境设置 publicPath
// 生产环境：强制使用相对路径 './'，忽略环境变量设置，可以直接部署在根目录
// 如果需要部署在特定子目录（如 /task/），请使用构建脚本 build:task
const getPublicPath = () => {
  if (process.env.NODE_ENV === 'production') {
    // 强制使用相对路径 './'，忽略所有环境变量设置
    // 这样可以确保打包后的资源路径是相对于 index.html 的，可以直接部署在根目录
    return './';
  }
  // 开发环境：使用环境变量或默认值 '/'
  return process.env.VUE_APP_BASE_URL || '/';
};

module.exports = defineConfig({
  publicPath: getPublicPath(),
  outputDir: "dist",
  assetsDir: "static",
  lintOnSave: process.env.NODE_ENV === "development",
  productionSourceMap: false,
  devServer: {
    port,
    client: {
      overlay: false, // 关闭浏览器接口请求错误，页面提示报错
    },
    proxy: {
      // 配置代理规则
      [process.env.VUE_APP_BASE_API]: {
        // 与实际的接口路径匹配
        target: process.env.VUE_APP_GLOB_DOMAIN_URL, // 目标服务器地址
        changeOrigin: true, // 允许跨域
        secure: false, // 如果是https接口，需要配置这个参数
        ws: false,
      },
    },
    headers: {
      "Access-Control-Allow-Origin": "*",
    },
  },
  transpileDependencies: true,
  configureWebpack: {
    name,
    resolve: {
      alias: {
        "@": resolve("src"),
      },
    },
    performance: {
      hints: false,
    },
  },
  pluginOptions: {
    "style-resources-loader": {
      preProcessor: "less",
      patterns: [path.resolve(__dirname, "./src/*.less")],
    },
  },
  css: {
    sourceMap: false,
    loaderOptions: {
      less: {
        // 全局变量
        additionalData: '@import "@/assets/css/variables.less";',
        lessOptions: {
          javascriptEnabled: true,
          modifyVars: {
            "@ant-prefix": process.env.VUE_APP_PREFIXCLS, //添加子应用样式前缀
          },
        },
      },
    },
  },
});
